<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
    
    <head>
        <title>Cytoscape Web example</title>
        
        <script type="text/javascript" src="js/cytoscape/json2.min.js"></script>
        <script type="text/javascript" src="js/cytoscape/AC_OETags.min.js"></script>
        <script type="text/javascript" src="js/cytoscape/cytoscapeweb.min.js"></script>
        <script type="text/javascript" src="jquery.js"></script>          
        <script type="text/javascript" src="visual.js"></script>
        
        
        <style>
            * { margin: 0; padding: 0; font-family: Helvetica, Arial, Verdana, sans-serif; }
            html, body { height: 100%; width: 100%; padding: 0; margin: 0; background-color: #f0f0f0; }
            body { line-height: 1.5; color: #000000; font-size: 14px; }
            /* The Cytoscape Web container must have its dimensions set. */
            #cytoscapeweb { width: 100%; height: 80%; }
            #note { width: 100%; text-align: center; padding-top: 1em; }
            .link { text-decoration: underline; color: #0b94b1; cursor: pointer; }
        </style>
    </head>
    
    <body>
        <div id="cytoscapeweb">
            Cytoscape Web will replace the contents of this div with your graph.
        </div>
        <div id="note">
            <span class="link" id="color">Color me surprised</span>
        </div>
    </body>
    
</html>